<template>
  <div>
    <el-dialog
      top="30px"
      width="1000px"
      title="在保项目"
      :visible.sync="visible"
      :before-close="beforeClose"
      :close-on-click-modal="false"
      append-to-body
    >
      <el-form class="query-table-form" @submit.native.prevent :inline="true" :model="params">
        <el-form-item>
          <el-input
            v-model="params.customer_name"
            placeholder="项目名称查询"
            clearable
            @change="getData()"
          ></el-input>
        </el-form-item>
        <el-form-item>
          <el-input
            v-model="params.corp_name"
            placeholder="负责人查询"
            clearable
            @change="getData()"
          ></el-input>
        </el-form-item>
        <el-form-item>
          <select-address
            v-model="params.address_code"
            clearable
            placeholder="地址查询"
            auto-top
            @change="getData()"
          ></select-address>
        </el-form-item>
        <el-form-item>
          <el-button icon="el-icon-search" @click="getData()">查询</el-button>
        </el-form-item>
      </el-form>

      <c-table border v-loading="loading" :columns="tableColumns" :data="tableData"></c-table>
      <div class="query-pagination">
        <div></div>
        <el-pagination
          layout="total, prev, pager, next, jumper"
          :current-page.sync="params.index"
          :page-size="params.size"
          :total="totalCount"
          @current-change="getData"
        ></el-pagination>
      </div>

      <postloan-file :visible.sync="reportVisible" :related-data="fileData"></postloan-file>

      <period-edit-dialog
        :visible.sync="editVisible"
        :form-data="editData"
        @success="handlerSuccess"
      ></period-edit-dialog>
    </el-dialog>
  </div>
</template>

<script>
import baseMixins from '@/credit/views/city/bus/normal/mixins'
import SelectAddress from '@/components/select/SelectAddress'
import { baseTableColumns } from '@/credit/views/county/unionProvince/Approve'
import PostloanFile from '@/credit/views/county/unionProvince/components/loanAfter/PostloanFile'
import PeriodEditDialog from '@/credit/views/city/bus/normal/postloan/period/PeriodEditDialog'
export default {
  components: {
    SelectAddress,
    PostloanFile,
    PeriodEditDialog,
  },
  mixins: [baseMixins],
  props: {
    visible: Boolean,
  },
  data() {
    return {
      loading: false,
      tableData: [],
      params: {
        index: 1,
        size: 10,
        'confuse_status.neq': 3,
        'loan_approval_status.eq': 3,
        'load_beh_status.neq': 6,
      },
      order: {
        is_history: 'asc',
        create_time: 'desc',
      },
      dateFmt: 'yyyy-MM-dd',
      tableColumns: [
        ...baseTableColumns,
        { attrs: { label: '放款金额(万元)', prop: 'reply_funds', align: 'center' } },
        { attrs: { label: '放款时间', prop: 'startDate', align: 'center', width: 100 } },
        { attrs: { label: '到期时间', prop: 'endDate', align: 'center', width: 100 } },
        {
          attrs: { label: '放款银行', prop: 'bank_name', align: 'center' },
          process: v => v || '-',
        },
        { attrs: { label: '在保余额(万元)', prop: 'left_funds', align: 'center' } },
        {
          attrs: { label: '操作', align: 'center', minWidth: 110 },
          operations: [
            {
              name: '展期',
              event: this.handleEdit,
            },
            {
              name: '详情',
              event: this.hanleView,
            },
          ],
        },
      ],

      reportVisible: false,
      fileData: {},
      editVisible: false,
      editData: {},
    }
  },
  computed: {},
  watch: {},
  created() {
    this.params['orWhere.service_id.eq'] = this.clientId
    this.params['orWhere.gua_service_id.eq'] = this.clientId
    this.getData()
  },
  mounted() {},
  methods: {
    getParams() {
      return this.params
    },
    handlerSuccess() {
      this.getData()
      this.$emit('success')
      this.beforeClose()
    },
    hanleView(row = {}) {
      this.fileData = row
      this.reportVisible = true
    },
    handleEdit(row) {
      this.editVisible = true
      this.editData = { ...row }
    },
    dataAdapter(item) {
      item.endDate = this.$utils.dateFormat(item.load_end_date, this.dateFmt)
      item.startDate = this.$utils.dateFormat(item.load_date, this.dateFmt)
      return item
    },
    beforeClose() {
      this.$emit('update:visible', false)
    },
  },
}
</script>

<style lang="scss" scoped></style>
